<template>
	<div class="news-info">
		<h2 class="news-title">{{newsInfo.title}}</h2>
		<p class="news-sub">
			<span class="nes-tab"><label>来源：</label><span>{{newsInfo.creator}}</span></span>
			<span class="nes-tab"><label>编辑：</label><span>{{newsInfo.creator}}</span></span>
			<span class="nes-tab"><label>发表时间：</label><span>{{newsInfo.creatTime}}</span></span>
		</p>
		<p class="news-content" v-html="newsInfo.content"></p>
	</div>
</template>

<script>
	import 	News 		from '@/service/news-service.js';
	import 	Mutil 		from 	"@/util/mm.js"
	const 	_mm 		= 		new Mutil();
	const 	_news 		=	  new News();
	export default {
	  	name: 'NavInfo',
  		data :function() {
		    return {
		    	newsInfo : {}
		    }
	  	},
	  	watch: {
		    $route( to , from ){  
		      	this.findOneNews(this.to.parms.id);
		    }
		},
		created (){
			this.findOneNews(this.$route.params.id);
		},
	  	components:{
	  	},
	  	methods:{
	  	// 这个是通过新闻Id进行查找指定的数据
		findOneNews(id){
			_news.findOneNews({'id': this.$route.params.id}).then((res)=>{
				res.data.creatTime = _mm.timestampToTime(res.data.creatTime);
				this.newsInfo = res.data;
			},(errMsg)=>{
				console.log(errMsg);
			})
		},
	  }
	}
</script>

<style scoped lang="less">
.news-info{
	padding: 60px;
	.news-title{
		text-align: center;
		font-size: 32px;
		color: #333;
	}
	.news-sub{
		text-align: center;
		border-bottom: 1px solid #dfdfdf;
		padding-top: 20px;
		padding-bottom: 31px;
		.nes-tab{
			padding-left: 25px;
			font-size: 14px;
			color: #999;
		}
	}
	.news-content{
		padding-top: 50px;
	}
}
</style>